<!DOCTYPE html>
 <html>
 	<head>
 		<meta charset="utf-8">
 		<meta name="referrer" content="no-referrer"/>
 		<title>Ajax应用</title>
		<link rel="stylesheet" type="text/css" href="css/tabdemo.css" />
		<script src="js/jquery-3.5.1.min.js" type="text/javascript" charset="utf-8"></script>
		<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
		<script src="js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
 	</head>
 	<body>
 		<div class="tabox">
 			<div class="hd">
 				<ul>
 					<li class="on">最近热门电影</li>
 					<li class=" ">即将上映电影</li>
 					<li class=" ">电影详情</li>
 					<li class=" ">热评商品</li>
 					<li class=" ">新品上架</li>
 				</ul>
 			</div>
 			<div class="container" id="bd">
 				<ul class="row row-cols-3"></ul>
 			</div>
 		</div>
 		<script type="text/javascript">
 			$(function() {
				//179000516 王德令
 				$("li").click(function(){
 					$(this).addClass("on").siblings().removeClass("on");
 					$(".lh").eq($(this).index()).show().siblings().hide();
 					$.ajax({
 						method:"get",
 						url:"https://douban.uieee.com/v2/movie/in_theaters",
 						success:function(date) {
 							console.log(date);
 							console.log(date.subjects.length);
 							for(let i in date.subjects){
 								$("#bd ul").append("<li>电影名："+date.subjects[i].title+"<br />"
								+"<img src='"+date.subjects[i].images.large+"'/>"+"</li>");
 							}			
 						}
 					})
 				})	
 			})
 		</script>
 	</body>
 </html>
